import { createRouter, createWebHistory } from 'vue-router'

// 创建路由实例
const router = createRouter({

  // history路由配置
  history: createWebHistory(import.meta.env.BASE_URL),

  // 配置路由路径
  routes: [
    {
      path: '/',
      name: 'layout',
      component: () => import('@/views/Layout/index.vue'),
      children: [
        {
          path: '',
          name: 'home',
          component: () => import('@/views/Home/index.vue')
        },
        {
          path: '/category/:id',
          name: 'category',
          component: () => import('@/views/Category/index.vue'),
          
        },
        {
            path: '/category/sub/:id',
            name: 'sub',
            component: () => import('@/views/SubCategory/index.vue')
        },
        {
          path: '/detail/:id',
          name: 'detail',
          component: () => import('@/views/Detail/index.vue')
        },
        {
          path: '/cart',
          name: 'cart',
          component: () => import('@/views/Cart/index.vue')
        },
        {
          path: '/checkout',
          name: 'checkout',
          component: () => import('@/views/Checkout/index.vue')
        },
        {
          path: '/pay',
          name: 'pay',
          component: () => import('@/views/Pay/index.vue')
        },
        {
          path: '/paycallback',
          name: 'paycallback',
          component: () => import ('@/views/Pay/PayBack.vue')
        },
        {
          path: '/member',
          name: 'member',
          component: () => import('@/views/Member/index.vue'),
          children: [
            {
              path: '/member/user',
              name: 'user',
              component: () => import('@/views/Member/components/UserInfo.vue'),
              
            },
            {
              path: '/member/order',
              name: 'order',
              component: () => import('@/views/Member/components/UserOrder.vue')
            }
          ]
        },
        {
          path: '/sku',
          name: 'sku',
          component: () => import('@/views/Sku.vue')
        }
        
      ]
    },
    {
      path: '/login',
      name: 'login',
      component: () => import('@/views/Login/index.vue')
    }
  ],
  // 路由行为配置项， 即路由跳转后页面滚动行为效果
  scrollBehavior: () => {
    return {
      top: 0, // 路由跳转后回到页面顶部
      behavior: 'smooth' // 切换方式为平滑滚动
    }
  }

})

export default router
